import styles from "./index.module.scss";
import {
  Sign,
  MusicO,
  VideoO,
  SettingO,
  CalendarO,
  UserO,
} from "@react-vant/icons";
const quickEntry = () => {
  const quickList = [
    {
      text: "每日推荐",
      url: "",
      icon: "Sign",
    },
    {
      text: "私人FM",
      url: "",
      icon: "MusicO",
    },
    {
      text: "歌单",
      url: "",
      icon: "VideoO",
    },
    {
      text: "排行榜",
      url: "",
      icon: "SettingO",
    },
    {
      text: "有声书",
      url: "",
      icon: "UserO",
    },
    {
      text: "直播",
      url: "",
      icon: "CalendarO",
    },
  ];
  return (
    <div className={styles.quickEntry}>
      <div className={styles.quickEntryWarp}>
        {quickList.map((it, index) => {
          switch (it.icon) {
            case "Sign":
              return (
                <div className={styles.quickItem} key={index}>
                  <div>
                    <Sign />
                  </div>
                  <div>{it.text}</div>
                </div>
              );
            case "MusicO":
              return (
                <div className={styles.quickItem} key={index}>
                  <div>
                    <MusicO />
                  </div>
                  <div>{it.text}</div>
                </div>
              );
            case "VideoO":
              return (
                <div className={styles.quickItem} key={index}>
                  <div>
                    <VideoO />
                  </div>
                  <div>{it.text}</div>
                </div>
              );
            case "SettingO":
              return (
                <div className={styles.quickItem} key={index}>
                  <div>
                    <SettingO />
                  </div>
                  <div>{it.text}</div>
                </div>
              );
            case "UserO":
              return (
                <div className={styles.quickItem} key={index}>
                  <div>
                    <UserO />
                  </div>
                  <div>{it.text}</div>
                </div>
              );

            case "CalendarO":
              return (
                <div className={styles.quickItem} key={index}>
                  <div>
                    <CalendarO />
                  </div>
                  <div>{it.text}</div>
                </div>
              );
          }
        })}
      </div>
    </div>
  );
};

export default quickEntry;
